<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="icon" type="image/x-icon" href="images/favicon.ico">
    <!-- 样式初始化 -->
    <link rel="stylesheet" href="./css/rest.css">
    <script type="text/javascript">
        document.write("<link rel='stylesheet' type='text/css' href='./css/index.css?v=" + new Date().getTime() + "'>");
    </script>
    <!-- bootstrap 样式-->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <title>起盒官网</title>
</head>

<body>
    <div class="header">
        <!-- 头部nav -->
        <header class="nav">
            <div class="container">
                <img src="./images/logo@2x.png" alt="" class="logo">
                <ul class="nav-list">
                    <li class="active">
                        <a href="#">首页</a>
                    </li>
                    <li>
                        <a href="#">使用教程</a>
                    </li>
                    <li>
                        <a href="#">合作</a>
                    </li>
                    <li>
                        <a href="#"> 加入我们</a>
                    </li>
                    <li>
                        <a href="#">关于我们</a>
                    </li>
                </ul>
            </div>
        </header>
    </div>
    <!-- 轮播图 -->
    <div class="broadcast">
        <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
                <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner">
                <div class="carousel-item active">
                    <img src="./images/broadcast1.png" alt="">
                </div>
                <div class="carousel-item" style="background:#555; width: 100%;height: 650px;">
                </div>
                <div class="carousel-item" style="background:#777; width: 100%;height: 650px;">
                </div>
            </div>
            <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
    </div>
    <!-- 解决方案 -->
    <div class="solution">
        <div>
            <img src="./images/tuoyuan-right.png" alt="" srcset="" class="right-tuoyuan">
            <img src="./images/tuoyuan-left.png" alt="" srcset="" class="left-tuoyuan">

            <div class="content-box">
                <div class="title">
                    解决方案
                </div>
                <div class="title-min">
                    solution
                </div>
                <div class="discription">
                    文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案
                </div>
            </div>
        </div>

    </div>
    <!-- 关于我们 -->
    <div class="about-us container-fluid">
        <div class="title">关于我们</div>
        <div class="title-english">ABUT US</div>
        <div class=" content-wrapper">
            <div class="row">
                <!-- 关于我们左侧 -->
                <div class="col-md-6 content-left">
                    <div class="row">
                        <div class="col-md-8 offset-md-3 img">
                        </div>
                    </div>
                </div>
                <!-- 关于我们右侧 -->
                <div class="col-md-6 content-right">
                    <div class="row">
                        <div class="col-md-8 offset-md-1 content-text">
                            <div class="title">四川众心起盒网络科技有限</div>
                            <div class="title-en">Si Chuan Qihe Internet Technology Co. , TLD</div>
                            <div class="discroption">
                                文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案文案
                            </div>
                            <div class="go-aboutus">
                                <button>了解详情</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 留言给我们 -->
    <div class="container-fluid notice">
        <div class="title">留言给我们</div>
        <div class="title-en">leave a message</div>
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-6">
                    <div class="row">
                        <div class="col-md-9 offset-md-2 left-content">
                            <img src="./images/2.5@3x.png" alt="">
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="row">
                        <div class="col-md-8 offset-md-1 form-wrapper">
                            <form action="">
                                <div class="name">
                                    <p>
                                        <label for="">姓名</label>
                                    </p>
                                    <p>
                                        <input type="text" name="" id="name">
                                    </p>
                                </div>
                                <div class="phone">
                                    <p>
                                        <label for="">联系电话</label>
                                    </p>
                                    <p>
                                        <input type="text" name="" id="phone">
                                    </p>
                                </div>
                                <div class="qq-wx">
                                    <p>
                                        <label for="">QQ/微信</label>
                                    </p>
                                    <p>
                                        <input type="text" name="" id="qq-wx">
                                    </p>
                                </div>
                                <div class="email">
                                    <p>
                                        <label for="">邮箱</label>
                                    </p>
                                    <p>
                                        <input type="text" name="" id="email">
                                    </p>
                                </div>
                                <div class="submit">
                                    <button>提交</button>
                                    <span class="tips">工作人员将在2小时内联系您</span>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 页尾部分 -->
    <div class="footer">
        <div class="tianda-logo">
            <img src="./images/logopng168×70@3x.png" alt="">
        </div>
        <div class="huawei-logo">
            <img src="./images/huawei-logo.png" alt="">
        </div>
        <div class="sunni-logo">
            <img src="./images/sunni-logo.png" alt="">
        </div>
        <div class="weixin-logo">
            <img src="./images/weixin-logo.png" alt="">
        </div>
    </div>
</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="./js/index.js"></script>
<script>
    (function () {
        var designW = 1920;  //设计稿宽
        var font_rate = 12;
        //适配
        document.getElementsByTagName("html")[0].style.fontSize = document.body.offsetWidth / designW * font_rate + "px";
        document.getElementsByTagName("body")[0].style.fontSize = document.body.offsetWidth / designW * font_rate + "px";

        //监测窗口大小变化
        window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function () {
            document.getElementsByTagName("html")[0].style.fontSize = document.body.offsetWidth / designW * font_rate + "px";
            document.getElementsByTagName("body")[0].style.fontSize = document.body.offsetWidth / designW * font_rate + "px";
        }, false);
    })();
</script>

</html>